# Upmath: Math Online Editor ### _Create web articles and blog posts with equations and diagrams_ Upmath extremely simplifies this task by using Markdown and LaTeX. It converts the Markdown syntax extended with LaTeX equations support into HTML code you can publish anywhere on the web. ![Paper written in LaTeX](/i/latex.jpg) ## Markdown Definition from [Wikipedia](https://en.wikipedia.org/wiki/Markdown): > Markdown is a lightweight markup language with plain text formatting syntax designed so that it can be converted to HTML and many other formats using a tool by the same name. Markdown is often used to format readme files, for writing messages in online discussion forums, and to create rich text using a plain text editor. The main idea of Markdown is to use a simple plain text markup. It's ~~hard~~ easy to __make__ **bold** _or_ *italic* text. Simple equations can be formatted with subscripts and superscripts: *E*~0~=*mc*^2^. I have added the LaTeX support: $$E_0=mc^2$$. Among Markdown features are: * images (see above); * links: [service main page](/ "link title"); * code: `untouched equation source is *E*~0~=*mc*^2^`; * unordered lists--when a line starts with `+`, `-`, or `*`; 1. sub-lists 1. and ordered lists too; * direct use <nobr>of HTML</nobr>–for <span style="color: red">anything else</span>. Also the editor supports typographic replacements: (c) (r) (tm) (p) +- !!!!!! ???? ,, -- --- ## LaTeX The editor converts LaTeX equations in double-dollars `$$`: $$ax^2+bx+c=0$$. All equations are rendered as block equations. If you need inline ones, you can add the prefix `\inline`: $$\inline p={1\over q}$$. But it is a good practice to place big equations on separate lines: $$x_{1,2} = {-b\pm\sqrt{b^2 - 4ac} \over 2a}.$$ In this case the LaTeX syntax will be highlighted in the source code. You can even add equation numbers (unfortunately there is no automatic numbering and refs support): $$|\vec{A}|=\sqrt{A_x^2 + A_y^2 + A_z^2}.$$(1) It is possible to write Cyrillic symbols in `\text` command: $$Q_\text{плавления}>0$$. One can use matrices: $$T^{\mu\nu}=\begin{pmatrix} \varepsilon&0&0&0\\ 0&\varepsilon/3&0&0\\ 0&0&\varepsilon/3&0\\ 0&0&0&\varepsilon/3 \end{pmatrix},$$ integrals: $$P_\omega={n_\omega\over 2}\hbar\omega\,{1+R\over 1-v^2}\int\limits_{-1}^{1}dx\,(x-v)|x-v|,$$ cool tikz-pictures: $$\usetikzlibrary{decorations.pathmorphing} \begin{tikzpicture}[line width=0.2mm,scale=1.0545]\small \tikzset{>=stealth} \tikzset{snake it/.style={->,semithick, decoration={snake,amplitude=.3mm,segment length=2.5mm,post length=0.9mm},decorate}} \def\h{3} \def\d{0.2} \def\ww{1.4} \def\w{1+\ww} \def\p{1.5} \def\r{0.7} \coordinate[label=below:$A_1$] (A1) at (\ww,\p); \coordinate[label=above:$B_1$] (B1) at (\ww,\p+\h); \coordinate[label=below:$A_2$] (A2) at (\w,\p); \coordinate[label=above:$B_2$] (B2) at (\w,\p+\h); \coordinate[label=left:$C$] (C1) at (0,0); \coordinate[label=left:$D$] (D) at (0,\h); \draw[fill=blue!14](A2)--(B2)-- ++(\d,0)-- ++(0,-\h)--cycle; \draw[gray,thin](C1)-- +(\w+\d,0); \draw[dashed,gray,fill=blue!5](A1)-- (B1)-- ++(\d,0)-- ++(0,-\h)-- cycle; \draw[dashed,line width=0.14mm](A1)--(C1)--(D)--(B1); \draw[snake it](C1)--(A2) node[pos=0.6,below] {$c\Delta t$}; \draw[->,semithick](\ww,\p+0.44*\h)-- +(\w-\ww,0) node[pos=0.6,above] {$v\Delta t$}; \draw[snake it](D)--(B2); \draw[thin](\r,0) arc (0:atan2(\p,\w):\r) node[midway,right,yshift=0.06cm] {$\theta$}; \draw[opacity=0](-0.40,-0.14)-- ++(0,5.06); \end{tikzpicture}$$ plots: $$\begin{tikzpicture}[scale=1.0544]\small \begin{axis}[axis line style=gray, samples=120, width=9.0cm,height=6.4cm, xmin=-1.5, xmax=1.5, ymin=0, ymax=1.8, restrict y to domain=-0.2:2, ytick={1}, xtick={-1,1}, axis equal, axis x line=center, axis y line=center, xlabel=$x$,ylabel=$y$] \addplot[red,domain=-2:1,semithick]{exp(x)}; \addplot[black]{x+1}; \addplot[] coordinates {(1,1.5)} node{$y=x+1$}; \addplot[red] coordinates {(-1,0.6)} node{$y=e^x$}; \path (axis cs:0,0) node [anchor=north west,yshift=-0.07cm] {0}; \end{axis} \end{tikzpicture}$$ and [the rest of LaTeX features](https://en.wikibooks.org/wiki/LaTeX/Mathematics). ## About Upmath It works in browsers, except equations rendered [on the server](//tex.s2cms.com/). The editor stores your text in the browser to prevent the loss of your work in case of software or hardware failures. I have designed and developed this lightweight editor and the service for converting LaTeX equations into svg-pictures to make publishing math texts on the web easy. I consider client-side rendering, the rival technique implemented in [MathJax](https://www.mathjax.org/), to be too limited and resource-consuming, especially on mobile devices. The source code is [published on Github](https://github.com/parpalak/upmath.me) under MIT license. *** Now you can erase this instruction and start writing your own scientific post. If you want to see the instruction again, open the editor in a private tab, in a different browser or download and clear your post and refresh the page. Have a nice day :) [Roman Parpalak](https://written.ru/), web developer and UX expert.
Upmath extremely simplifies this task by using Markdown and LaTeX. It converts the Markdown syntax extended with LaTeX equations support into HTML code you can publish anywhere on the web.
Definition from Wikipedia:
Markdown is a lightweight markup language with plain text formatting syntax designed so that it can be converted to HTML and many other formats using a tool by the same name. Markdown is often used to format readme files, for writing messages in online discussion forums, and to create rich text using a plain text editor.
The main idea of Markdown is to use a simple plain text markup. It’s hard easy to make bold or italic text. Simple equations can be formatted with subscripts and superscripts: E0=mc2. I have added the LaTeX support: .
Among Markdown features are:
untouched equation source is *E*~0~=*mc*^2^
;+
, -
, or *
;
Also the editor supports typographic replacements: © ® ™ § ± !!! ??? , – —
The editor converts LaTeX equations in double-dollars $$
: . All equations are rendered as block equations. If you need inline ones, you can add the prefix \inline
: . But it is a good practice to place big equations on separate lines:
In this case the LaTeX syntax will be highlighted in the source code. You can even add equation numbers (unfortunately there is no automatic numbering and refs support):
(1)
It is possible to write Cyrillic symbols in \text
command: .
One can use matrices:
integrals:
cool tikz-pictures:
plots:
and the rest of LaTeX features.
It works in browsers, except equations rendered on the server. The editor stores your text in the browser to prevent the loss of your work in case of software or hardware failures.
I have designed and developed this lightweight editor and the service for converting LaTeX equations into svg-pictures to make publishing math texts on the web easy. I consider client-side rendering, the rival technique implemented in MathJax, to be too limited and resource-consuming, especially on mobile devices.
The source code is published on Github under MIT license.
Now you can erase this instruction and start writing your own scientific post. If you want to see the instruction again, open the editor in a private tab, in a different browser or download and clear your post and refresh the page.
Have a nice day :)
Roman Parpalak, web developer and UX expert.